<template>
  <el-form :model="rule" :rules="rules" ref="ruleForm2" label-width="100px" size="mini">
    <el-form-item label="上课日期" prop="starttime">
      <el-date-picker
        :picker-options="pickerOptions"
        v-model="rule.starttime"
        type="date"
        placeholder="选择日期"
      ></el-date-picker>
    </el-form-item>
    <el-form-item label="上课时段" prop="schoolclasstime">
      <el-select v-model="rule.schoolclasstime" allow-create placeholder="请选择时间段">
        <el-option
          v-for="(item, i) in getschoolclasstime"
          :key="`2clazzschedule${i}`"
          :label="`${item.starttime}-${item.endtime}`"
          :value="`${item.starttime}-${item.endtime}`"
        ></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="课时" prop="hour">
      <el-input-number v-model="rule.hour" :min="1" :max="10" label="描述文字"></el-input-number>
    </el-form-item>
    <el-form-item label="教室" prop="schoolclassroomid">
      <el-select v-model="rule.schoolclassroomid" allow-create placeholder="请选择教室">
        <el-option
          v-for="(item, i) in classroom"
          :key="`4clazzschedule${i}`"
          :label="item.name"
          :value="item.ID"
        ></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="教师" prop="schooluserid">
      <el-select v-model="rule.schooluserid" allow-create placeholder="请选择教师">
        <el-option
          v-for="(item, i) in user"
          :key="`5clazzschedule${i}`"
          :label="item.name"
          :value="item.ID"
        ></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="助教">
      <el-select v-model="rule.schooluserids" allow-create placeholder="请选择助教">
        <el-option
          v-for="(item, i) in getschooluser.filter(v=> !v.state)"
          :key="`7clazzschedule${i}`"
          :label="item.name"
          :value="item.ID"
        ></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="课程内容">
      <el-select
        v-model="rule.schoolclasshourid"
        filterable
        allow-create
        default-first-option
        placeholder="课程内容，或者手动编辑"
      >
        <el-option
          v-for="item in classhours"
          :key="`8clazzschedule${item.ID}`"
          :label="item.name"
          :value="item.ID"
        ></el-option>
      </el-select>
    </el-form-item>
  </el-form>
</template>

<script>
import { disabledDate } from "../../../utils.js";
export default {
  name: "selectcourse",
  props: ["classhours", "getschoolclasstime"],
  data() {
    return {
      pickerOptions: {
        disabledDate
      },
      rules: {
        starttime: [{ required: true, message: "请选择时间", trigger: "blur" }],
        schoolclasstime: [
          { required: true, message: "请选择时间段", trigger: "change" }
        ],
        schooluserid: [
          { required: true, message: "请选择教师", trigger: "change" }
        ],
        schoolclassroomid: [
          { required: true, message: "请选择教室", trigger: "change" }
        ],
        hour: [{ required: true, message: "添加课时", trigger: "blur" }],
        checkList: [
          { required: true, validator: this.ischeckList, trigger: "blur" }
        ]
      },
      type: false,
      setaddress: false,
      tableData: [],
      pushdata: [],
      rule: {
        starttime: "",
        schoolclasstime: "",
        info: "",
        schooluserids: "",
        schooluserid: "",
        schoolclassroomid: "",
        index: "",
        schoolclasshourid: ""
      }
    };
  }
};
</script>
